summaryrefslogtreecommitdiff
path: root/app/[lng]/evcp/data-room
diff options
context:
space:
mode:
Diffstat (limited to 'app/[lng]/evcp/data-room')
-rw-r--r--app/[lng]/evcp/data-room/[projectId]/files/page.tsx17
-rw-r--r--app/[lng]/evcp/data-room/[projectId]/layout.tsx19
-rw-r--r--app/[lng]/evcp/data-room/[projectId]/members/page.tsx811
-rw-r--r--app/[lng]/evcp/data-room/[projectId]/page.tsx10
-rw-r--r--app/[lng]/evcp/data-room/[projectId]/settings/page.tsx488
-rw-r--r--app/[lng]/evcp/data-room/[projectId]/stats/page.tsx373
-rw-r--r--app/[lng]/evcp/data-room/layout.tsx17
-rw-r--r--app/[lng]/evcp/data-room/owner-companies/[id]/page.tsx43
-rw-r--r--app/[lng]/evcp/data-room/owner-companies/[id]/users/new/page.tsx41
-rw-r--r--app/[lng]/evcp/data-room/owner-companies/[id]/users/page.tsx63
-rw-r--r--app/[lng]/evcp/data-room/owner-companies/new/page.tsx18
-rw-r--r--app/[lng]/evcp/data-room/owner-companies/page.tsx32
-rw-r--r--app/[lng]/evcp/data-room/page.tsx26
13 files changed, 1958 insertions, 0 deletions
diff --git a/app/[lng]/evcp/data-room/[projectId]/files/page.tsx b/app/[lng]/evcp/data-room/[projectId]/files/page.tsx
new file mode 100644
index 00000000..baac96ad
--- /dev/null
+++ b/app/[lng]/evcp/data-room/[projectId]/files/page.tsx
@@ -0,0 +1,17 @@
+// app/projects/[projectId]/files/page.tsx
+import { FileManager } from '@/components/file-manager/FileManager';
+
+export default async function ProjectFilesPage({
+ params,
+}: {
+ params: { projectId: string };
+}) {
+
+ const projectId = await params.projectId
+
+ return (
+ <div className="h-full flex flex-col">
+ <FileManager projectId={projectId} />
+ </div>
+ );
+} \ No newline at end of file
diff --git a/app/[lng]/evcp/data-room/[projectId]/layout.tsx b/app/[lng]/evcp/data-room/[projectId]/layout.tsx
new file mode 100644
index 00000000..d2e74f8e
--- /dev/null
+++ b/app/[lng]/evcp/data-room/[projectId]/layout.tsx
@@ -0,0 +1,19 @@
+// app/projects/[projectId]/layout.tsx
+import { ProjectNav } from '@/components/project/ProjectNav';
+
+export default function ProjectLayout({
+ children,
+ params,
+}: {
+ children: React.ReactNode;
+ params: { projectId: string };
+}) {
+ return (
+ <div className="flex flex-col h-full">
+ <ProjectNav projectId={params.projectId} />
+ <div className="flex-1 overflow-y-auto">
+ {children}
+ </div>
+ </div>
+ );
+}
diff --git a/app/[lng]/evcp/data-room/[projectId]/members/page.tsx b/app/[lng]/evcp/data-room/[projectId]/members/page.tsx
new file mode 100644
index 00000000..18442c0e
--- /dev/null
+++ b/app/[lng]/evcp/data-room/[projectId]/members/page.tsx
@@ -0,0 +1,811 @@
+// app/projects/[projectId]/members/page.tsx
+'use client';
+
+import { use, useState, useEffect, useRef } from 'react';
+import {
+ Users,
+ UserPlus,
+ Crown,
+ Shield,
+ Eye,
+ Edit2,
+ Trash2,
+ Mail,
+ MoreVertical,
+ Search,
+ Filter,
+ Check,
+ ChevronsUpDown,
+ Loader2,
+ UserCog
+} from 'lucide-react';
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { Badge } from '@/components/ui/badge';
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+} from '@/components/ui/dialog';
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuSeparator,
+ DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
+import {
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
+} from '@/components/ui/select';
+import {
+ Popover,
+ PopoverContent,
+ PopoverTrigger,
+} from '@/components/ui/popover';
+import {
+ Command,
+ CommandEmpty,
+ CommandGroup,
+ CommandInput,
+ CommandItem,
+ CommandList,
+} from '@/components/ui/command';
+import { Label } from '@/components/ui/label';
+import { useToast } from '@/hooks/use-toast';
+import { cn } from '@/lib/utils';
+import {
+ Table, TableBody, TableCaption, TableCell, TableHead, TableHeader, TableRow
+} from '@/components/ui/table';
+import { Separator } from '@/components/ui/separator';
+import { getUsersForFilter } from '@/lib/gtc-contract/service';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
+
+interface Member {
+ id: string;
+ userId: number;
+ user: {
+ name: string;
+ email: string;
+ imageUrl?: string;
+ domain: string;
+ };
+ role: 'owner' | 'admin' | 'editor' | 'viewer';
+ addedAt: string;
+ lastAccess?: string;
+}
+
+interface User {
+ id: number;
+ name: string;
+ email: string;
+ domain?: string; // 'partners' | 'internal' 등
+}
+
+export default function ProjectMembersPage({
+ params: promiseParams
+}: {
+ params: Promise<{ projectId: string }>
+}) {
+ // Next.js 15+ params Promise 처리
+ const params = use(promiseParams);
+ const projectId = params.projectId;
+
+ const [members, setMembers] = useState<Member[]>([]);
+ const [loading, setLoading] = useState(true);
+ const [searchQuery, setSearchQuery] = useState('');
+ const [roleFilter, setRoleFilter] = useState<string>('all');
+ const [addMemberOpen, setAddMemberOpen] = useState(false);
+ const [editingMember, setEditingMember] = useState<Member | null>(null);
+
+ // 사용자 선택 관련 상태
+ const [availableUsers, setAvailableUsers] = useState<User[]>([]);
+ const [selectedUser, setSelectedUser] = useState<User | null>(null);
+ const [userSearchTerm, setUserSearchTerm] = useState('');
+ const [userPopoverOpen, setUserPopoverOpen] = useState(false);
+ const [loadingUsers, setLoadingUsers] = useState(false);
+ const [isExternalUser, setIsExternalUser] = useState(false); // 외부 사용자 여부
+
+ const [newMemberRole, setNewMemberRole] = useState<string>('viewer');
+ const [currentUserRole, setCurrentUserRole] = useState<string>('viewer');
+ const [page, setPage] = useState(1);
+ const pageSize = 20;
+
+ // Command component key management
+ const userOptionIdsRef = useRef<Record<number, string>>({});
+ const popoverContentId = `popover-content-${Date.now()}`;
+ const commandId = `command-${Date.now()}`;
+
+ const { toast } = useToast();
+
+ useEffect(() => {
+ setPage(1);
+ }, [searchQuery, roleFilter]);
+
+ useEffect(() => {
+ fetchMembers();
+ checkUserRole();
+ }, [projectId]);
+
+ // 다이얼로그가 열릴 때 사용자 목록 가져오기
+ useEffect(() => {
+ if (addMemberOpen) {
+ fetchAvailableUsers();
+ } else {
+ // 다이얼로그가 닫힐 때 초기화
+ setSelectedUser(null);
+ setUserSearchTerm('');
+ setNewMemberRole('viewer');
+ setIsExternalUser(false);
+ }
+ }, [addMemberOpen]);
+
+ const fetchAvailableUsers = async () => {
+ try {
+ setLoadingUsers(true);
+ const users = await getUsersForFilter();
+ // 이미 프로젝트에 있는 멤버는 제외
+ const memberUserIds = members.map(m => m.userId);
+ const filteredUsers = users.filter(u => !memberUserIds.includes(u.id));
+ setAvailableUsers(filteredUsers);
+ } catch (error) {
+ console.error('사용자 목록 로드 실패:', error);
+ toast({
+ title: '오류',
+ description: '사용자 목록을 불러올 수 없습니다.',
+ variant: 'destructive',
+ });
+ } finally {
+ setLoadingUsers(false);
+ }
+ };
+
+ const fetchMembers = async () => {
+ try {
+ setLoading(true);
+ const response = await fetch(`/api/projects/${projectId}/members`);
+ const data = await response.json();
+ setMembers(data.member);
+ } catch (error) {
+ toast({
+ title: '오류',
+ description: '멤버 목록을 불러올 수 없습니다.',
+ variant: 'destructive',
+ });
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ const checkUserRole = async () => {
+ try {
+ const response = await fetch(`/api/projects/${projectId}/access`);
+ const data = await response.json();
+ setCurrentUserRole(data.role);
+ } catch (error) {
+ console.error('권한 확인 실패:', error);
+ }
+ };
+
+ const addMember = async () => {
+ if (!selectedUser) {
+ toast({
+ title: '오류',
+ description: '사용자를 선택해주세요.',
+ variant: 'destructive',
+ });
+ return;
+ }
+
+ try {
+ const response = await fetch(`/api/projects/${projectId}/members`, {
+ method: 'POST',
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify({
+ userId: selectedUser.id,
+ role: newMemberRole,
+ }),
+ });
+
+ if (!response.ok) throw new Error('멤버 추가 실패');
+
+ toast({
+ title: '성공',
+ description: '새 멤버가 추가되었습니다.',
+ });
+
+ setAddMemberOpen(false);
+ fetchMembers();
+ } catch (error) {
+ toast({
+ title: '오류',
+ description: '멤버 추가에 실패했습니다.',
+ variant: 'destructive',
+ });
+ }
+ };
+
+ const updateMemberRole = async (memberId: string, newRole: string) => {
+ try {
+ const response = await fetch(`/api/projects/${projectId}/members/${memberId}`, {
+ method: 'PATCH',
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify({ role: newRole }),
+ });
+
+ if (!response.ok) throw new Error('역할 변경 실패');
+
+ toast({
+ title: '성공',
+ description: '멤버 역할이 변경되었습니다.',
+ });
+
+ fetchMembers();
+ } catch (error) {
+ toast({
+ title: '오류',
+ description: '역할 변경에 실패했습니다.',
+ variant: 'destructive',
+ });
+ }
+ };
+
+ const removeMember = async (memberId: string) => {
+ try {
+ const response = await fetch(`/api/projects/${projectId}/members/${memberId}`, {
+ method: 'DELETE',
+ });
+
+ if (!response.ok) throw new Error('멤버 제거 실패');
+
+ toast({
+ title: '성공',
+ description: '멤버가 제거되었습니다.',
+ });
+
+ fetchMembers();
+ } catch (error) {
+ toast({
+ title: '오류',
+ description: '멤버 제거에 실패했습니다.',
+ variant: 'destructive',
+ });
+ }
+ };
+
+ const handleSelectUser = (user: User) => {
+ setSelectedUser(user);
+ setUserPopoverOpen(false);
+
+ // 외부 사용자(partners)인 경우 역할을 viewer로 고정
+ if (user.domain === 'partners') {
+ setIsExternalUser(true);
+ setNewMemberRole('viewer');
+ } else {
+ setIsExternalUser(false);
+ // 내부 사용자는 기본값 viewer로 설정하되 변경 가능
+ setNewMemberRole('viewer');
+ }
+ };
+
+ const formatDateShort = (iso?: string) =>
+ iso ? new Date(iso).toLocaleDateString() : '-';
+
+ const roleConfig = {
+ owner: { label: 'Owner', icon: Crown, color: 'text-yellow-500', bg: 'bg-yellow-50' },
+ admin: { label: 'Admin', icon: Shield, color: 'text-blue-500', bg: 'bg-blue-50' },
+ editor: { label: 'Editor', icon: Edit2, color: 'text-green-500', bg: 'bg-green-50' },
+ viewer: { label: 'Viewer', icon: Eye, color: 'text-gray-500', bg: 'bg-gray-50' },
+ };
+
+ const filteredMembers = members.filter(member => {
+ const matchesSearch = member.user.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
+ member.user.email.toLowerCase().includes(searchQuery.toLowerCase());
+ const matchesRole = roleFilter === 'all' || member.role === roleFilter;
+ return matchesSearch && matchesRole;
+ });
+
+ // 사용자 검색 필터링
+ const filteredUsers = availableUsers.filter(user =>
+ user.name.toLowerCase().includes(userSearchTerm.toLowerCase()) ||
+ user.email.toLowerCase().includes(userSearchTerm.toLowerCase())
+ );
+
+ const canManageMembers = currentUserRole === 'owner' || currentUserRole === 'admin';
+
+ const totalPages = Math.max(1, Math.ceil(filteredMembers.length / pageSize));
+ const paginatedMembers = filteredMembers.slice((page - 1) * pageSize, page * pageSize);
+
+ if (loading) {
+ return (
+ <div className="flex items-center justify-center min-h-[400px]">
+ <div className="text-center space-y-3">
+ <Loader2 className="h-8 w-8 animate-spin text-primary mx-auto" />
+ <p className="text-sm text-muted-foreground">멤버 목록을 불러오는 중...</p>
+ </div>
+ </div>
+ );
+ }
+
+ return (
+ <div className="p-6 space-y-6">
+ {/* 헤더 */}
+ <div className="flex items-center justify-between">
+ <div>
+ <h1 className="text-2xl font-bold">프로젝트 멤버</h1>
+ <p className="text-muted-foreground mt-1">
+ 프로젝트에 참여 중인 멤버를 관리합니다
+ </p>
+ </div>
+
+ {canManageMembers && (
+ <Button onClick={() => setAddMemberOpen(true)}>
+ <UserPlus className="h-4 w-4 mr-2" />
+ 멤버 추가
+ </Button>
+ )}
+ </div>
+
+ {/* 필터 */}
+ <div className="flex items-center gap-3">
+ <div className="relative flex-1 max-w-md">
+ <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
+ <Input
+ placeholder="이름 또는 이메일로 검색..."
+ className="pl-9"
+ value={searchQuery}
+ onChange={(e) => setSearchQuery(e.target.value)}
+ />
+ </div>
+
+ <Select value={roleFilter} onValueChange={setRoleFilter}>
+ <SelectTrigger className="w-40">
+ <SelectValue />
+ </SelectTrigger>
+ <SelectContent>
+ <SelectItem value="all">모든 역할</SelectItem>
+ <SelectItem value="owner">Owner</SelectItem>
+ <SelectItem value="admin">Admin</SelectItem>
+ <SelectItem value="editor">Editor</SelectItem>
+ <SelectItem value="viewer">Viewer</SelectItem>
+ </SelectContent>
+ </Select>
+ </div>
+
+ {/* 멤버 목록 (Table) */}
+ <div className="overflow-x-auto">
+ <Table className="[&_td]:py-2 [&_th]:py-2 text-sm">
+ <TableHeader className="sticky top-0 bg-background z-10">
+ <TableRow>
+ <TableHead className="w-[44px]"></TableHead>
+ <TableHead className="w-[100px]">이름</TableHead>
+ <TableHead className="min-w-[150px]">이메일</TableHead>
+ <TableHead className="w-[90px] text-center">구분</TableHead>
+ <TableHead className="w-[140px]">역할</TableHead>
+ <TableHead className="w-[130px]">추가일</TableHead>
+ <TableHead className="w-[150px]">마지막 접속</TableHead>
+ <TableHead className="w-[60px] text-right">액션</TableHead>
+ </TableRow>
+ </TableHeader>
+
+ <TableBody>
+ {paginatedMembers.length > 0 ? (
+ paginatedMembers.map((member) => {
+ const config = roleConfig[member.role];
+ const Icon = config.icon;
+ const isInternal = member.user.domain !== 'partners';
+
+ return (
+ <TableRow key={member.id} className="hover:bg-accent/40">
+ {/* Avatar */}
+ <TableCell className="align-middle">
+ <Avatar className="h-8 w-8">
+ <AvatarImage src={member.user.imageUrl} />
+ <AvatarFallback>
+ {member.user.name?.charAt(0).toUpperCase()}
+ </AvatarFallback>
+ </Avatar>
+ </TableCell>
+
+ {/* Name */}
+ <TableCell className="align-middle">
+ <span className="font-medium">{member.user.name}</span>
+ </TableCell>
+
+ {/* Email */}
+ <TableCell className="align-middle">
+ <span className="text-muted-foreground">{member.user.email}</span>
+ </TableCell>
+
+ {/* Domain */}
+ <TableCell className="align-middle text-center">
+ <Badge variant={isInternal ? 'secondary' : 'outline'}>
+ {isInternal ? 'Internal' : 'Partner'}
+ </Badge>
+ </TableCell>
+
+ {/* Role */}
+ <TableCell className="align-middle">
+ {canManageMembers && member.role !== 'owner' && member.user.domain !== 'partners' ? (
+ <Select
+ value={member.role}
+ onValueChange={(v) => updateMemberRole(member.id, v)}
+ >
+ <SelectTrigger className="h-8 w-[120px]">
+ <div className={cn('flex items-center gap-1')}>
+ <Icon className={cn('h-3 w-3', config.color)} />
+ <span className={cn('text-xs font-medium')}>
+ {config.label}
+ </span>
+ </div>
+ </SelectTrigger>
+ <SelectContent>
+ <SelectItem value="viewer">Viewer</SelectItem>
+ <SelectItem value="editor">Editor</SelectItem>
+ <SelectItem value="admin">Admin</SelectItem>
+ </SelectContent>
+ </Select>
+ ) : (
+ <div className="inline-flex items-center gap-2">
+ <div className={cn('px-2 py-1 rounded-full inline-flex items-center gap-1', config.bg)}>
+ <Icon className={cn('h-3 w-3', config.color)} />
+ <span className={cn('text-xs font-medium', config.color)}>
+ {config.label}
+ </span>
+ </div>
+ {member.user.domain === 'partners' && canManageMembers && member.role !== 'owner' && (
+ <span className="text-xs text-muted-foreground">(고정)</span>
+ )}
+ </div>
+ )}
+ </TableCell>
+
+ {/* AddedAt */}
+ <TableCell className="align-middle">
+ {formatDateShort(member.addedAt)}
+ </TableCell>
+
+ {/* LastAccess */}
+ <TableCell className="align-middle">
+ {formatDateShort(member.lastAccess)}
+ </TableCell>
+
+ {/* Actions */}
+ <TableCell className="align-middle">
+ <div className="flex justify-end">
+ {canManageMembers && member.role !== 'owner' ? (
+ <DropdownMenu>
+ <DropdownMenuTrigger asChild>
+ <Button variant="ghost" size="icon">
+ <MoreVertical className="h-4 w-4" />
+ </Button>
+ </DropdownMenuTrigger>
+ <DropdownMenuContent align="end">
+ <DropdownMenuItem>
+ <Mail className="h-4 w-4 mr-2" />
+ 메일 보내기
+ </DropdownMenuItem>
+ <DropdownMenuSeparator />
+ <DropdownMenuItem
+ className="text-red-600"
+ onClick={() => removeMember(member.id)}
+ >
+ <Trash2 className="h-4 w-4 mr-2" />
+ 제거
+ </DropdownMenuItem>
+ </DropdownMenuContent>
+ </DropdownMenu>
+ ) : (
+ <Button variant="ghost" size="icon" disabled>
+ <MoreVertical className="h-4 w-4" />
+ </Button>
+ )}
+ </div>
+ </TableCell>
+ </TableRow>
+ );
+ })
+ ) : (
+ <TableRow>
+ <TableCell colSpan={8} className="h-32 text-center text-muted-foreground">
+ <div className="flex flex-col items-center justify-center gap-2">
+ <Users className="h-8 w-8 text-muted-foreground/60" />
+ <span>검색 결과가 없습니다</span>
+ </div>
+ </TableCell>
+ </TableRow>
+ )}
+ </TableBody>
+ </Table>
+ </div>
+
+ {/* Pagination */}
+ <div className="flex items-center justify-between px-4 py-3 border-t">
+ <div className="text-sm text-muted-foreground">
+ 총 {filteredMembers.length}명 · {pageSize}명/페이지
+ </div>
+ <div className="flex items-center gap-2">
+ <Button
+ variant="outline"
+ size="sm"
+ onClick={() => setPage((p) => Math.max(1, p - 1))}
+ disabled={page === 1}
+ >
+ 이전
+ </Button>
+ <span className="text-sm">
+ {page} / {totalPages}
+ </span>
+ <Button
+ variant="outline"
+ size="sm"
+ onClick={() => setPage((p) => Math.min(totalPages, p + 1))}
+ disabled={page === totalPages}
+ >
+ 다음
+ </Button>
+ </div>
+ </div>
+
+ {/* 멤버 추가 다이얼로그 */}
+ <Dialog open={addMemberOpen} onOpenChange={setAddMemberOpen}>
+ <DialogContent className="max-w-lg">
+ <DialogHeader>
+ <DialogTitle>멤버 추가</DialogTitle>
+ <DialogDescription>
+ 프로젝트에 멤버를 추가합니다
+ </DialogDescription>
+ </DialogHeader>
+
+ <Tabs defaultValue="internal" className="w-full">
+ <TabsList className="grid w-full grid-cols-2">
+ <TabsTrigger value="internal">내부 사용자</TabsTrigger>
+ <TabsTrigger value="external" className="flex items-center gap-2">
+ 외부 사용자
+ <Badge variant="outline" className="ml-1 text-xs">Viewer 전용</Badge>
+ </TabsTrigger>
+ </TabsList>
+
+ <TabsContent value="internal" className="space-y-4 mt-4">
+ <div className="space-y-2">
+ <Label htmlFor="internal-user">사용자 선택</Label>
+
+ {loadingUsers ? (
+ <div className="flex items-center justify-center py-4">
+ <Loader2 className="h-4 w-4 animate-spin" />
+ <span className="ml-2 text-sm text-muted-foreground">사용자 목록 불러오는 중...</span>
+ </div>
+ ) : (
+ <>
+ <Popover open={userPopoverOpen} onOpenChange={setUserPopoverOpen}>
+ <PopoverTrigger asChild>
+ <Button
+ variant="outline"
+ role="combobox"
+ aria-expanded={userPopoverOpen}
+ className="w-full justify-between"
+ >
+ <span className="truncate">
+ {selectedUser && selectedUser.domain !== 'partners' ? (
+ <div className="text-left">
+ <div className="font-medium">{selectedUser.name}</div>
+ <div className="text-xs text-muted-foreground">{selectedUser.email}</div>
+ </div>
+ ) : (
+ "내부 사용자를 선택하세요..."
+ )}
+ </span>
+ <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
+ </Button>
+ </PopoverTrigger>
+ <PopoverContent className="w-[460px] p-0">
+ <Command>
+ <CommandInput
+ placeholder="이름 또는 이메일로 검색..."
+ value={userSearchTerm}
+ onValueChange={setUserSearchTerm}
+ />
+ <CommandList
+ className="max-h-[300px]"
+ onWheel={(e) => {
+ e.stopPropagation();
+ const target = e.currentTarget;
+ target.scrollTop += e.deltaY;
+ }}
+ >
+ <CommandEmpty>사용자를 찾을 수 없습니다.</CommandEmpty>
+ <CommandGroup heading="내부 사용자 목록">
+ {filteredUsers
+ .filter(u => u.domain !== 'partners')
+ .map((user) => (
+ <CommandItem
+ key={user.id}
+ onSelect={() => {
+ setSelectedUser(user);
+ setUserPopoverOpen(false);
+ setIsExternalUser(false);
+ setNewMemberRole('viewer');
+ }}
+ value={`${user.name} ${user.email}`}
+ className="truncate"
+ >
+ <Users className="mr-2 h-4 w-4 text-blue-500 flex-shrink-0" />
+ <div className="flex-1 truncate">
+ <div className="font-medium truncate">{user.name}</div>
+ <div className="text-xs text-muted-foreground truncate">{user.email}</div>
+ </div>
+ <Check
+ className={cn(
+ "ml-2 h-4 w-4 flex-shrink-0",
+ selectedUser?.id === user.id && !isExternalUser ? "opacity-100" : "opacity-0"
+ )}
+ />
+ </CommandItem>
+ ))}
+ </CommandGroup>
+ </CommandList>
+ </Command>
+ </PopoverContent>
+ </Popover>
+
+ <p className="text-xs text-muted-foreground">
+ 내부 사용자는 모든 역할을 부여할 수 있습니다.
+ </p>
+ </>
+ )}
+ </div>
+
+ <div className="space-y-2">
+ <Label htmlFor="internal-role">역할</Label>
+ <Select
+ value={newMemberRole}
+ onValueChange={setNewMemberRole}
+ disabled={!selectedUser || isExternalUser}
+ >
+ <SelectTrigger id="internal-role">
+ <SelectValue />
+ </SelectTrigger>
+ <SelectContent>
+ <SelectItem value="viewer">Viewer - 읽기 전용</SelectItem>
+ <SelectItem value="editor">Editor - 파일 편집 가능</SelectItem>
+ <SelectItem value="admin">Admin - 프로젝트 관리</SelectItem>
+ </SelectContent>
+ </Select>
+ </div>
+ </TabsContent>
+
+ <TabsContent value="external" className="space-y-4 mt-4">
+ <div className="rounded-lg bg-amber-50 border border-amber-200 p-3 mb-4">
+ <p className="text-sm text-amber-800">
+ <strong>보안 정책 안내</strong><br/>
+ 외부 사용자(파트너)는 보안 정책상 Viewer 권한만 부여 가능합니다.
+ </p>
+ </div>
+
+ <div className="space-y-2">
+ <Label htmlFor="external-user">파트너 선택</Label>
+
+ {loadingUsers ? (
+ <div className="flex items-center justify-center py-4">
+ <Loader2 className="h-4 w-4 animate-spin" />
+ <span className="ml-2 text-sm text-muted-foreground">사용자 목록 불러오는 중...</span>
+ </div>
+ ) : (
+ <Popover open={userPopoverOpen} onOpenChange={setUserPopoverOpen}>
+ <PopoverTrigger asChild>
+ <Button
+ variant="outline"
+ role="combobox"
+ aria-expanded={userPopoverOpen}
+ className="w-full justify-between"
+ >
+ <span className="truncate">
+ {selectedUser && selectedUser.domain === 'partners' ? (
+ <span className="flex items-center gap-2">
+ {selectedUser.name}
+ <Badge variant="outline" className="ml-1 text-xs">외부</Badge>
+ </span>
+ ) : (
+ "외부 사용자를 선택하세요..."
+ )}
+ </span>
+ <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
+ </Button>
+ </PopoverTrigger>
+ <PopoverContent className="w-[460px] p-0">
+ <Command>
+ <CommandInput
+ placeholder="이름으로 검색..."
+ value={userSearchTerm}
+ onValueChange={setUserSearchTerm}
+ />
+ <CommandList
+ className="max-h-[300px]"
+ onWheel={(e) => {
+ e.stopPropagation();
+ const target = e.currentTarget;
+ target.scrollTop += e.deltaY;
+ }}
+ >
+ <CommandEmpty>파트너를 찾을 수 없습니다.</CommandEmpty>
+ <CommandGroup heading="파트너 목록">
+ {filteredUsers
+ .filter(u => u.domain === 'partners')
+ .map((user) => (
+ <CommandItem
+ key={user.id}
+ onSelect={() => {
+ setSelectedUser(user);
+ setUserPopoverOpen(false);
+ setIsExternalUser(true);
+ setNewMemberRole('viewer');
+ }}
+ value={user.name}
+ className="truncate"
+ >
+ <Users className="mr-2 h-4 w-4 text-amber-600" />
+ <span className="truncate flex-1">{user.name}</span>
+ <Badge variant="outline" className="text-xs mx-2">파트너</Badge>
+ <Check
+ className={cn(
+ "ml-auto h-4 w-4 flex-shrink-0",
+ selectedUser?.id === user.id && isExternalUser ? "opacity-100" : "opacity-0"
+ )}
+ />
+ </CommandItem>
+ ))}
+ </CommandGroup>
+ </CommandList>
+ </Command>
+ </PopoverContent>
+ </Popover>
+ )}
+ </div>
+
+ <div className="space-y-2">
+ <Label htmlFor="external-role">역할</Label>
+ <Select value="viewer" disabled>
+ <SelectTrigger id="external-role" className="opacity-60">
+ <SelectValue />
+ </SelectTrigger>
+ <SelectContent>
+ <SelectItem value="viewer">Viewer - 읽기 전용 (고정)</SelectItem>
+ </SelectContent>
+ </Select>
+ </div>
+ </TabsContent>
+ </Tabs>
+
+ <DialogFooter>
+ <Button
+ variant="outline"
+ onClick={() => {
+ setAddMemberOpen(false);
+ setSelectedUser(null);
+ setUserSearchTerm('');
+ setNewMemberRole('viewer');
+ setIsExternalUser(false);
+ }}
+ >
+ 취소
+ </Button>
+ <Button
+ onClick={addMember}
+ disabled={!selectedUser}
+ >
+ 추가하기
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+ </div>
+ );
+} \ No newline at end of file
diff --git a/app/[lng]/evcp/data-room/[projectId]/page.tsx b/app/[lng]/evcp/data-room/[projectId]/page.tsx
new file mode 100644
index 00000000..d54a8cab
--- /dev/null
+++ b/app/[lng]/evcp/data-room/[projectId]/page.tsx
@@ -0,0 +1,10 @@
+// app/projects/[projectId]/page.tsx
+import { ProjectDashboard } from '@/components/project/ProjectDashboard';
+
+export default function ProjectPage({
+ params,
+}: {
+ params: { projectId: string };
+}) {
+ return <ProjectDashboard projectId={params.projectId} />;
+}
diff --git a/app/[lng]/evcp/data-room/[projectId]/settings/page.tsx b/app/[lng]/evcp/data-room/[projectId]/settings/page.tsx
new file mode 100644
index 00000000..aa0f3b52
--- /dev/null
+++ b/app/[lng]/evcp/data-room/[projectId]/settings/page.tsx
@@ -0,0 +1,488 @@
+
+// app/projects/[projectId]/settings/page.tsx
+'use client';
+
+import { useState, useEffect } from 'react';
+import {
+ Settings,
+ Shield,
+ Globe,
+ Trash2,
+ AlertCircle,
+ Save,
+ Lock,
+ Unlock,
+ Archive,
+ Users,
+ HardDrive
+} from 'lucide-react';
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { Label } from '@/components/ui/label';
+import { Switch } from '@/components/ui/switch';
+import { Textarea } from '@/components/ui/textarea';
+import { Alert, AlertDescription } from '@/components/ui/alert';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+} from '@/components/ui/dialog';
+import {
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
+} from '@/components/ui/select';
+import { useToast } from '@/hooks/use-toast';
+import { useRouter } from 'next/navigation';
+
+interface ProjectSettings {
+ id: string;
+ name: string;
+ description: string;
+ isPublic: boolean;
+ externalAccessEnabled: boolean;
+ storageLimit: number;
+ maxFileSize: number;
+ allowedFileTypes: string[];
+ autoArchiveDays: number;
+ requireApproval: boolean;
+ defaultCategory: string;
+}
+
+export default function ProjectSettingsPage({
+ params
+}: {
+ params: { projectId: string }
+}) {
+ const [settings, setSettings] = useState<ProjectSettings | null>(null);
+ const [loading, setLoading] = useState(true);
+ const [saving, setSaving] = useState(false);
+ const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
+ const [archiveDialogOpen, setArchiveDialogOpen] = useState(false);
+ const [currentUserRole, setCurrentUserRole] = useState<string>('viewer');
+
+ const { toast } = useToast();
+ const router = useRouter();
+
+ useEffect(() => {
+ fetchSettings();
+ checkUserRole();
+ }, [params.projectId]);
+
+ const fetchSettings = async () => {
+ try {
+ setLoading(true);
+ const response = await fetch(`/api/projects/${params.projectId}/settings`);
+
+ if (!response.ok) {
+ throw new Error('설정을 불러올 수 없습니다');
+ }
+
+ const data = await response.json();
+ setSettings(data);
+ } catch (error) {
+ toast({
+ title: '오류',
+ description: '프로젝트 설정을 불러올 수 없습니다.',
+ variant: 'destructive',
+ });
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ const checkUserRole = async () => {
+ try {
+ const response = await fetch(`/api/projects/${params.projectId}/access`);
+ const data = await response.json();
+ setCurrentUserRole(data.role);
+ } catch (error) {
+ console.error('권한 확인 실패:', error);
+ }
+ };
+
+ const saveSettings = async () => {
+ if (!settings) return;
+
+ try {
+ setSaving(true);
+ const response = await fetch(`/api/projects/${params.projectId}/settings`, {
+ method: 'PATCH',
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify(settings),
+ });
+
+ if (!response.ok) throw new Error('설정 저장 실패');
+
+ toast({
+ title: '성공',
+ description: '프로젝트 설정이 저장되었습니다.',
+ });
+ } catch (error) {
+ toast({
+ title: '오류',
+ description: '설정 저장에 실패했습니다.',
+ variant: 'destructive',
+ });
+ } finally {
+ setSaving(false);
+ }
+ };
+
+ const deleteProject = async () => {
+ try {
+ const response = await fetch(`/api/projects/${params.projectId}`, {
+ method: 'DELETE',
+ });
+
+ if (!response.ok) throw new Error('프로젝트 삭제 실패');
+
+ toast({
+ title: '성공',
+ description: '프로젝트가 삭제되었습니다.',
+ });
+
+ router.push('/projects');
+ } catch (error) {
+ toast({
+ title: '오류',
+ description: '프로젝트 삭제에 실패했습니다.',
+ variant: 'destructive',
+ });
+ }
+ };
+
+ const archiveProject = async () => {
+ try {
+ const response = await fetch(`/api/projects/${params.projectId}/archive`, {
+ method: 'POST',
+ });
+
+ if (!response.ok) throw new Error('프로젝트 보관 실패');
+
+ toast({
+ title: '성공',
+ description: '프로젝트가 보관되었습니다.',
+ });
+
+ router.push('/projects');
+ } catch (error) {
+ toast({
+ title: '오류',
+ description: '프로젝트 보관에 실패했습니다.',
+ variant: 'destructive',
+ });
+ }
+ };
+
+ const canEdit = currentUserRole === 'owner' || currentUserRole === 'admin';
+
+ if (loading || !settings) {
+ return (
+ <div className="p-6">
+ <div className="animate-pulse space-y-4">
+ {[...Array(5)].map((_, i) => (
+ <div key={i} className="h-20 bg-gray-200 rounded" />
+ ))}
+ </div>
+ </div>
+ );
+ }
+
+ return (
+ <div className="p-6 space-y-6 max-w-4xl">
+ {/* 헤더 */}
+ <div className="flex items-center justify-between">
+ <div>
+ <h1 className="text-2xl font-bold">프로젝트 설정</h1>
+ <p className="text-muted-foreground mt-1">
+ 프로젝트 설정을 관리합니다
+ </p>
+ </div>
+
+ {canEdit && (
+ <Button onClick={saveSettings} disabled={saving}>
+ <Save className="h-4 w-4 mr-2" />
+ {saving ? '저장 중...' : '변경사항 저장'}
+ </Button>
+ )}
+ </div>
+
+ {!canEdit && (
+ <Alert>
+ <AlertCircle className="h-4 w-4" />
+ <AlertDescription>
+ 프로젝트 설정을 변경하려면 Owner 또는 Admin 권한이 필요합니다.
+ </AlertDescription>
+ </Alert>
+ )}
+
+ <Tabs defaultValue="general">
+ <TabsList>
+ <TabsTrigger value="general">일반</TabsTrigger>
+ <TabsTrigger value="access">접근 관리</TabsTrigger>
+ <TabsTrigger value="storage">스토리지</TabsTrigger>
+ {currentUserRole === 'owner' && (
+ <TabsTrigger value="danger">위험 영역</TabsTrigger>
+ )}
+ </TabsList>
+
+ <TabsContent value="general" className="space-y-4">
+ <Card>
+ <CardHeader>
+ <CardTitle>기본 정보</CardTitle>
+ </CardHeader>
+ <CardContent className="space-y-4">
+ <div>
+ <Label htmlFor="name">프로젝트 이름</Label>
+ <Input
+ id="name"
+ value={settings.name}
+ onChange={(e) => setSettings({ ...settings, name: e.target.value })}
+ disabled={!canEdit}
+ />
+ </div>
+
+ <div>
+ <Label htmlFor="description">설명</Label>
+ <Textarea
+ id="description"
+ value={settings.description}
+ onChange={(e) => setSettings({ ...settings, description: e.target.value })}
+ disabled={!canEdit}
+ rows={3}
+ />
+ </div>
+
+ <div>
+ <Label htmlFor="category">기본 파일 카테고리</Label>
+ <Select
+ value={settings.defaultCategory}
+ onValueChange={(value) => setSettings({ ...settings, defaultCategory: value })}
+ disabled={!canEdit}
+ >
+ <SelectTrigger>
+ <SelectValue />
+ </SelectTrigger>
+ <SelectContent>
+ <SelectItem value="public">Public - 공개</SelectItem>
+ <SelectItem value="restricted">Restricted - 제한</SelectItem>
+ <SelectItem value="confidential">Confidential - 기밀</SelectItem>
+ <SelectItem value="internal">Internal - 내부</SelectItem>
+ </SelectContent>
+ </Select>
+ </div>
+ </CardContent>
+ </Card>
+ </TabsContent>
+
+ <TabsContent value="access" className="space-y-4">
+ <Card>
+ <CardHeader>
+ <CardTitle>접근 설정</CardTitle>
+ </CardHeader>
+ <CardContent className="space-y-4">
+ <div className="flex items-center justify-between">
+ <div>
+ <Label htmlFor="public">공개 프로젝트</Label>
+ <p className="text-sm text-muted-foreground">
+ 모든 사용자가 이 프로젝트를 볼 수 있습니다
+ </p>
+ </div>
+ <Switch
+ id="public"
+ checked={settings.isPublic}
+ onCheckedChange={(checked) => setSettings({ ...settings, isPublic: checked })}
+ disabled={!canEdit}
+ />
+ </div>
+
+ <div className="flex items-center justify-between">
+ <div>
+ <Label htmlFor="external">외부 사용자 접근 허용</Label>
+ <p className="text-sm text-muted-foreground">
+ 파트너사 사용자도 접근할 수 있습니다
+ </p>
+ </div>
+ <Switch
+ id="external"
+ checked={settings.externalAccessEnabled}
+ onCheckedChange={(checked) =>
+ setSettings({ ...settings, externalAccessEnabled: checked })
+ }
+ disabled={!canEdit}
+ />
+ </div>
+
+ <div className="flex items-center justify-between">
+ <div>
+ <Label htmlFor="approval">멤버 승인 필요</Label>
+ <p className="text-sm text-muted-foreground">
+ 새 멤버 참여 시 관리자 승인이 필요합니다
+ </p>
+ </div>
+ <Switch
+ id="approval"
+ checked={settings.requireApproval}
+ onCheckedChange={(checked) =>
+ setSettings({ ...settings, requireApproval: checked })
+ }
+ disabled={!canEdit}
+ />
+ </div>
+ </CardContent>
+ </Card>
+ </TabsContent>
+
+ <TabsContent value="storage" className="space-y-4">
+ <Card>
+ <CardHeader>
+ <CardTitle>스토리지 설정</CardTitle>
+ </CardHeader>
+ <CardContent className="space-y-4">
+ <div>
+ <Label htmlFor="storage-limit">스토리지 제한 (GB)</Label>
+ <Input
+ id="storage-limit"
+ type="number"
+ value={settings.storageLimit}
+ onChange={(e) => setSettings({
+ ...settings,
+ storageLimit: parseInt(e.target.value)
+ })}
+ disabled={!canEdit}
+ />
+ </div>
+
+ <div>
+ <Label htmlFor="file-size">최대 파일 크기 (MB)</Label>
+ <Input
+ id="file-size"
+ type="number"
+ value={settings.maxFileSize}
+ onChange={(e) => setSettings({
+ ...settings,
+ maxFileSize: parseInt(e.target.value)
+ })}
+ disabled={!canEdit}
+ />
+ </div>
+
+ <div>
+ <Label htmlFor="auto-archive">자동 보관 (일)</Label>
+ <Input
+ id="auto-archive"
+ type="number"
+ value={settings.autoArchiveDays}
+ onChange={(e) => setSettings({
+ ...settings,
+ autoArchiveDays: parseInt(e.target.value)
+ })}
+ disabled={!canEdit}
+ />
+ <p className="text-sm text-muted-foreground mt-1">
+ 설정한 기간 동안 접근하지 않은 파일을 자동으로 보관합니다
+ </p>
+ </div>
+ </CardContent>
+ </Card>
+ </TabsContent>
+
+ {currentUserRole === 'owner' && (
+ <TabsContent value="danger" className="space-y-4">
+ <Card className="border-red-200">
+ <CardHeader>
+ <CardTitle className="text-red-600">위험 영역</CardTitle>
+ <CardDescription>
+ 이 작업들은 되돌릴 수 없습니다. 신중하게 진행하세요.
+ </CardDescription>
+ </CardHeader>
+ <CardContent className="space-y-4">
+ <div className="flex items-center justify-between p-4 border rounded-lg">
+ <div>
+ <h3 className="font-medium">프로젝트 보관</h3>
+ <p className="text-sm text-muted-foreground">
+ 프로젝트를 보관하면 읽기 전용이 됩니다
+ </p>
+ </div>
+ <Button
+ variant="outline"
+ onClick={() => setArchiveDialogOpen(true)}
+ >
+ <Archive className="h-4 w-4 mr-2" />
+ 프로젝트 보관
+ </Button>
+ </div>
+
+ <div className="flex items-center justify-between p-4 border rounded-lg border-red-200">
+ <div>
+ <h3 className="font-medium text-red-600">프로젝트 삭제</h3>
+ <p className="text-sm text-muted-foreground">
+ 프로젝트와 모든 파일을 영구적으로 삭제합니다
+ </p>
+ </div>
+ <Button
+ variant="destructive"
+ onClick={() => setDeleteDialogOpen(true)}
+ >
+ <Trash2 className="h-4 w-4 mr-2" />
+ 프로젝트 삭제
+ </Button>
+ </div>
+ </CardContent>
+ </Card>
+ </TabsContent>
+ )}
+ </Tabs>
+
+ {/* 삭제 확인 다이얼로그 */}
+ <Dialog open={deleteDialogOpen} onOpenChange={setDeleteDialogOpen}>
+ <DialogContent>
+ <DialogHeader>
+ <DialogTitle>프로젝트 삭제</DialogTitle>
+ <DialogDescription className="text-red-600">
+ 정말로 이 프로젝트를 삭제하시겠습니까?
+ 모든 파일과 데이터가 영구적으로 삭제됩니다.
+ </DialogDescription>
+ </DialogHeader>
+ <DialogFooter>
+ <Button variant="outline" onClick={() => setDeleteDialogOpen(false)}>
+ 취소
+ </Button>
+ <Button variant="destructive" onClick={deleteProject}>
+ 삭제
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+
+ {/* 보관 확인 다이얼로그 */}
+ <Dialog open={archiveDialogOpen} onOpenChange={setArchiveDialogOpen}>
+ <DialogContent>
+ <DialogHeader>
+ <DialogTitle>프로젝트 보관</DialogTitle>
+ <DialogDescription>
+ 프로젝트를 보관하시겠습니까?
+ 보관된 프로젝트는 읽기 전용이 되며, 언제든지 복원할 수 있습니다.
+ </DialogDescription>
+ </DialogHeader>
+ <DialogFooter>
+ <Button variant="outline" onClick={() => setArchiveDialogOpen(false)}>
+ 취소
+ </Button>
+ <Button onClick={archiveProject}>
+ 보관
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+ </div>
+ );
+}
diff --git a/app/[lng]/evcp/data-room/[projectId]/stats/page.tsx b/app/[lng]/evcp/data-room/[projectId]/stats/page.tsx
new file mode 100644
index 00000000..7f652a99
--- /dev/null
+++ b/app/[lng]/evcp/data-room/[projectId]/stats/page.tsx
@@ -0,0 +1,373 @@
+// app/projects/[projectId]/stats/page.tsx
+'use client';
+
+import { use, useState, useEffect } from 'react';
+import {
+ BarChart3,
+ TrendingUp,
+ HardDrive,
+ Users,
+ Eye,
+ Download,
+ Upload,
+ Calendar,
+ FileText,
+ FolderOpen,
+ Activity
+} from 'lucide-react';
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
+import { Badge } from '@/components/ui/badge';
+import { Progress } from '@/components/ui/progress';
+import { useToast } from '@/hooks/use-toast';
+import { cn } from '@/lib/utils';
+
+interface ProjectStats {
+ storage: {
+ used: number;
+ limit: number;
+ fileCount: number;
+ folderCount: number;
+ byCategory: {
+ public: number;
+ restricted: number;
+ confidential: number;
+ internal: number;
+ };
+ };
+ activity: {
+ views: number;
+ downloads: number;
+ uploads: number;
+ shares: number;
+ trend: number; // 증감률
+ };
+ users: {
+ total: number;
+ active: number;
+ byRole: {
+ admin: number;
+ editor: number;
+ viewer: number;
+ };
+ };
+ recent: {
+ type: string;
+ user: string;
+ action: string;
+ timestamp: string;
+ details: string;
+ }[];
+}
+
+export default function ProjectStatsPage({
+ params
+}: {
+ params: Promise<{ projectId: string }>
+}) {
+ // Next.js 15에서 params를 unwrap
+ const resolvedParams = use(params);
+ const projectId = resolvedParams.projectId;
+
+ const [stats, setStats] = useState<ProjectStats | null>(null);
+ const [loading, setLoading] = useState(true);
+ const [dateRange, setDateRange] = useState('30d');
+ const { toast } = useToast();
+
+ useEffect(() => {
+ fetchStats();
+ }, [projectId, dateRange]);
+
+ const fetchStats = async () => {
+ try {
+ setLoading(true);
+ const response = await fetch(
+ `/api/projects/${projectId}/stats?range=${dateRange}`
+ );
+
+ if (!response.ok) {
+ if (response.status === 403) {
+ throw new Error('통계를 볼 권한이 없습니다');
+ }
+ throw new Error('통계 로드 실패');
+ }
+
+ const data = await response.json();
+ setStats(data);
+ } catch (error: any) {
+ toast({
+ title: '오류',
+ description: error.message || '통계를 불러올 수 없습니다.',
+ variant: 'destructive',
+ });
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ const formatBytes = (bytes: number) => {
+ if (bytes === 0) return '0 Bytes';
+ const k = 1024;
+ const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
+ const i = Math.floor(Math.log(bytes) / Math.log(k));
+ return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
+ };
+
+ const formatNumber = (num: number) => {
+ return new Intl.NumberFormat('ko-KR').format(num);
+ };
+
+ if (loading) {
+ return (
+ <div className="p-6">
+ <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
+ {[...Array(8)].map((_, i) => (
+ <div key={i} className="h-32 bg-gray-200 animate-pulse rounded-lg" />
+ ))}
+ </div>
+ </div>
+ );
+ }
+
+ if (!stats) {
+ return (
+ <div className="p-6 text-center">
+ <BarChart3 className="h-12 w-12 mx-auto mb-3 text-muted-foreground" />
+ <p className="text-muted-foreground">통계를 불러올 수 없습니다</p>
+ </div>
+ );
+ }
+
+ const storagePercentage = (stats.storage.used / stats.storage.limit) * 100;
+
+ return (
+ <div className="p-6 space-y-6">
+ {/* 헤더 */}
+ <div className="flex items-center justify-between">
+ <div>
+ <h1 className="text-2xl font-bold">프로젝트 통계</h1>
+ <p className="text-muted-foreground mt-1">
+ 프로젝트 사용 현황과 활동 내역을 확인합니다
+ </p>
+ </div>
+
+ <Tabs value={dateRange} onValueChange={setDateRange}>
+ <TabsList>
+ <TabsTrigger value="7d">7일</TabsTrigger>
+ <TabsTrigger value="30d">30일</TabsTrigger>
+ <TabsTrigger value="90d">90일</TabsTrigger>
+ </TabsList>
+ </Tabs>
+ </div>
+
+ {/* 주요 지표 */}
+ <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
+ <Card>
+ <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+ <CardTitle className="text-sm font-medium">스토리지 사용량</CardTitle>
+ <HardDrive className="h-4 w-4 text-muted-foreground" />
+ </CardHeader>
+ <CardContent>
+ <div className="text-2xl font-bold">
+ {formatBytes(stats.storage.used)}
+ </div>
+ {/* <Progress value={storagePercentage} className="mt-2" /> */}
+ {/* <p className="text-xs text-muted-foreground mt-1">
+ 총 {formatBytes(stats.storage.limit)} 중 {storagePercentage.toFixed(1)}% 사용
+ </p> */}
+ </CardContent>
+ </Card>
+
+ <Card>
+ <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+ <CardTitle className="text-sm font-medium">파일 수</CardTitle>
+ <FileText className="h-4 w-4 text-muted-foreground" />
+ </CardHeader>
+ <CardContent>
+ <div className="text-2xl font-bold">
+ {formatNumber(stats.storage.fileCount)}
+ </div>
+ <p className="text-xs text-muted-foreground mt-1">
+ 폴더 {formatNumber(stats.storage.folderCount)}개 포함
+ </p>
+ </CardContent>
+ </Card>
+
+ <Card>
+ <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+ <CardTitle className="text-sm font-medium">활성 사용자</CardTitle>
+ <Users className="h-4 w-4 text-muted-foreground" />
+ </CardHeader>
+ <CardContent>
+ <div className="text-2xl font-bold">
+ {stats.users.active}
+ </div>
+ <p className="text-xs text-muted-foreground mt-1">
+ 전체 {stats.users.total}명 중
+ </p>
+ </CardContent>
+ </Card>
+
+ <Card>
+ <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+ <CardTitle className="text-sm font-medium">총 다운로드</CardTitle>
+ <Download className="h-4 w-4 text-muted-foreground" />
+ </CardHeader>
+ <CardContent>
+ <div className="text-2xl font-bold">
+ {formatNumber(stats.activity.downloads)}
+ </div>
+ <div className="flex items-center gap-1 mt-1">
+ {stats.activity.trend > 0 ? (
+ <TrendingUp className="h-3 w-3 text-green-500" />
+ ) : (
+ <TrendingUp className="h-3 w-3 text-red-500 rotate-180" />
+ )}
+ <span className={cn(
+ "text-xs",
+ stats.activity.trend > 0 ? "text-green-500" : "text-red-500"
+ )}>
+ {Math.abs(stats.activity.trend)}%
+ </span>
+ </div>
+ </CardContent>
+ </Card>
+ </div>
+
+ {/* 상세 통계 */}
+ <div className="grid gap-6 md:grid-cols-2">
+ {/* 파일 카테고리 분포 */}
+ <Card>
+ <CardHeader>
+ <CardTitle>파일 카테고리</CardTitle>
+ <CardDescription>카테고리별 파일 분포</CardDescription>
+ </CardHeader>
+ <CardContent className="space-y-3">
+ <div className="flex items-center justify-between">
+ <div className="flex items-center gap-2">
+ <div className="h-2 w-2 bg-green-500 rounded-full" />
+ <span className="text-sm">Public</span>
+ </div>
+ <span className="text-sm font-medium">
+ {stats.storage.byCategory.public}
+ </span>
+ </div>
+ <div className="flex items-center justify-between">
+ <div className="flex items-center gap-2">
+ <div className="h-2 w-2 bg-yellow-500 rounded-full" />
+ <span className="text-sm">Restricted</span>
+ </div>
+ <span className="text-sm font-medium">
+ {stats.storage.byCategory.restricted}
+ </span>
+ </div>
+ <div className="flex items-center justify-between">
+ <div className="flex items-center gap-2">
+ <div className="h-2 w-2 bg-red-500 rounded-full" />
+ <span className="text-sm">Confidential</span>
+ </div>
+ <span className="text-sm font-medium">
+ {stats.storage.byCategory.confidential}
+ </span>
+ </div>
+ <div className="flex items-center justify-between">
+ <div className="flex items-center gap-2">
+ <div className="h-2 w-2 bg-blue-500 rounded-full" />
+ <span className="text-sm">Internal</span>
+ </div>
+ <span className="text-sm font-medium">
+ {stats.storage.byCategory.internal}
+ </span>
+ </div>
+ </CardContent>
+ </Card>
+
+ {/* 활동 요약 */}
+ <Card>
+ <CardHeader>
+ <CardTitle>활동 요약</CardTitle>
+ <CardDescription>기간별 활동 내역</CardDescription>
+ </CardHeader>
+ <CardContent className="space-y-3">
+ <div className="flex items-center justify-between">
+ <div className="flex items-center gap-2">
+ <Eye className="h-4 w-4 text-muted-foreground" />
+ <span className="text-sm">조회수</span>
+ </div>
+ <span className="text-sm font-medium">
+ {formatNumber(stats.activity.views)}
+ </span>
+ </div>
+ <div className="flex items-center justify-between">
+ <div className="flex items-center gap-2">
+ <Download className="h-4 w-4 text-muted-foreground" />
+ <span className="text-sm">다운로드</span>
+ </div>
+ <span className="text-sm font-medium">
+ {formatNumber(stats.activity.downloads)}
+ </span>
+ </div>
+ <div className="flex items-center justify-between">
+ <div className="flex items-center gap-2">
+ <Upload className="h-4 w-4 text-muted-foreground" />
+ <span className="text-sm">업로드</span>
+ </div>
+ <span className="text-sm font-medium">
+ {formatNumber(stats.activity.uploads)}
+ </span>
+ </div>
+ <div className="flex items-center justify-between">
+ <div className="flex items-center gap-2">
+ <Users className="h-4 w-4 text-muted-foreground" />
+ <span className="text-sm">공유</span>
+ </div>
+ <span className="text-sm font-medium">
+ {formatNumber(stats.activity.shares)}
+ </span>
+ </div>
+ </CardContent>
+ </Card>
+ </div>
+
+{/* 최근 활동 */}
+<Card>
+ <CardHeader>
+ <CardTitle>최근 활동</CardTitle>
+ <CardDescription>프로젝트 내 최근 활동 내역</CardDescription>
+ </CardHeader>
+
+ {/* 패딩이 스크롤에 포함되도록 CardContent p-0 + 내부 래퍼에 패딩 */}
+ <CardContent className="p-0">
+ <div
+ className="max-h-80 md:max-h-96 xl:max-h-[480px] overflow-y-auto px-6 pb-6"
+ style={{ scrollbarGutter: "stable" }} // 스크롤바 생겨도 레이아웃 흔들림 방지
+ aria-label="최근 활동 스크롤 영역"
+ tabIndex={0} // 키보드 포커스 가능
+ >
+ <ul role="list" className="divide-y">
+ {stats.recent.map((activity, index) => (
+ <li key={index} className="flex items-center gap-3 py-3">
+ <Activity className="h-4 w-4 text-muted-foreground shrink-0" />
+ <div className="min-w-0 flex-1">
+ <p className="text-sm">
+ <span className="font-medium">{activity.user}</span>
+ {" "}님이{" "}
+ <span className="font-medium">{activity.details}</span>
+ {activity.action === "upload" && "을(를) 업로드했습니다"}
+ {activity.action === "download" && "을(를) 다운로드했습니다"}
+ {activity.action === "view" && "을(를) 조회했습니다"}
+ {activity.action === "share" && "을(를) 공유했습니다"}
+ </p>
+ <p className="text-xs text-muted-foreground mt-1">
+ {new Date(activity.timestamp).toLocaleString()}
+ </p>
+ </div>
+ </li>
+ ))}
+ </ul>
+ </div>
+ </CardContent>
+</Card>
+ </div>
+ );
+} \ No newline at end of file
diff --git a/app/[lng]/evcp/data-room/layout.tsx b/app/[lng]/evcp/data-room/layout.tsx
new file mode 100644
index 00000000..9bef6027
--- /dev/null
+++ b/app/[lng]/evcp/data-room/layout.tsx
@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+import { SiteFooter } from '@/components/layout/Footer';
+import { HeaderDataRoom } from '@/components/layout/HeaderDataroom';
+
+export default function EvcpLayout({ children }: { children: ReactNode }) {
+ return (
+ <div className="flex flex-col h-screen bg-background">
+ <HeaderDataRoom />
+ <main className="flex-1 overflow-hidden">
+ <div className='container-wrapper h-full'>
+ {children}
+ </div>
+ </main>
+ <SiteFooter/>
+ </div>
+ );
+} \ No newline at end of file
diff --git a/app/[lng]/evcp/data-room/owner-companies/[id]/page.tsx b/app/[lng]/evcp/data-room/owner-companies/[id]/page.tsx
new file mode 100644
index 00000000..cc1901e4
--- /dev/null
+++ b/app/[lng]/evcp/data-room/owner-companies/[id]/page.tsx
@@ -0,0 +1,43 @@
+// app/evcp/data-room/owner-companies/[id]/page.tsx
+import db from "@/db/db";
+import { ownerCompanies } from "@/db/schema";
+import { eq } from "drizzle-orm";
+import { notFound } from "next/navigation";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { OwnerCompanyForm } from "@/lib/owner-companies/owner-company-form";
+
+export default async function EditOwnerCompanyPage({
+ params,
+}: {
+ params: { id: string };
+}) {
+ const companyId = parseInt(params.id);
+
+ const [company] = await db
+ .select()
+ .from(ownerCompanies)
+ .where(eq(ownerCompanies.id, companyId))
+ .limit(1);
+
+ if (!company) {
+ notFound();
+ }
+
+ return (
+ <div className="container mx-auto py-8 max-w-2xl">
+ <Card>
+ <CardHeader>
+ <CardTitle>발주처 회사 정보 수정</CardTitle>
+ </CardHeader>
+ <CardContent>
+ <OwnerCompanyForm
+ initialData={{
+ id: company.id,
+ name: company.name,
+ }}
+ />
+ </CardContent>
+ </Card>
+ </div>
+ );
+} \ No newline at end of file
diff --git a/app/[lng]/evcp/data-room/owner-companies/[id]/users/new/page.tsx b/app/[lng]/evcp/data-room/owner-companies/[id]/users/new/page.tsx
new file mode 100644
index 00000000..f78794c1
--- /dev/null
+++ b/app/[lng]/evcp/data-room/owner-companies/[id]/users/new/page.tsx
@@ -0,0 +1,41 @@
+// app/evcp/data-room/owner-companies/[id]/users/new/page.tsx
+import db from "@/db/db";
+import { ownerCompanies } from "@/db/schema";
+import { eq } from "drizzle-orm";
+import { notFound } from "next/navigation";
+import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card";
+import { OwnerCompanyUserForm } from "@/lib/owner-companies/owner-company-user-form";
+
+export default async function NewOwnerCompanyUserPage({
+ params,
+}: {
+ params: { id: string };
+}) {
+ const companyId = parseInt(params.id);
+
+ const [company] = await db
+ .select()
+ .from(ownerCompanies)
+ .where(eq(ownerCompanies.id, companyId))
+ .limit(1);
+
+ if (!company) {
+ notFound();
+ }
+
+ return (
+ <div className="container mx-auto py-8 max-w-2xl">
+ <Card>
+ <CardHeader>
+ <CardTitle>{company.name} - 사용자 추가</CardTitle>
+ <CardDescription>
+ 발주처 사용자를 등록합니다.
+ </CardDescription>
+ </CardHeader>
+ <CardContent>
+ <OwnerCompanyUserForm companyId={companyId} />
+ </CardContent>
+ </Card>
+ </div>
+ );
+} \ No newline at end of file
diff --git a/app/[lng]/evcp/data-room/owner-companies/[id]/users/page.tsx b/app/[lng]/evcp/data-room/owner-companies/[id]/users/page.tsx
new file mode 100644
index 00000000..87ebb364
--- /dev/null
+++ b/app/[lng]/evcp/data-room/owner-companies/[id]/users/page.tsx
@@ -0,0 +1,63 @@
+// app/(admin)/owner-companies/[id]/users/page.tsx
+import db from "@/db/db";
+import { users, ownerCompanies } from "@/db/schema";
+import { eq } from "drizzle-orm";
+import { Button } from "@/components/ui/button";
+import Link from "next/link";
+import { notFound } from "next/navigation";
+import { ArrowLeft, Plus } from "lucide-react";
+import { OwnerCompanyUserList } from "@/lib/owner-companies/owner-company-user-list";
+
+export default async function OwnerCompanyUsersPage({
+ params,
+ }: {
+ params: { id: string };
+ }) {
+ const companyId = parseInt(params.id);
+
+ const [company] = await db
+ .select()
+ .from(ownerCompanies)
+ .where(eq(ownerCompanies.id, companyId))
+ .limit(1);
+
+ if (!company) {
+ notFound();
+ }
+
+ const companyUsers = await db
+ .select()
+ .from(users)
+ .where(eq(users.ownerCompanyId, companyId))
+ .orderBy(users.createdAt);
+
+ return (
+ <div className="container mx-auto py-8">
+ <div className="mb-4">
+ <Button variant="ghost" size="sm" asChild>
+ <Link href="/evcp/data-room/owner-companies">
+ <ArrowLeft className="h-4 w-4 mr-2" />
+ 발주처 목록으로
+ </Link>
+ </Button>
+ </div>
+
+ <div className="flex justify-between items-center mb-6">
+ <div>
+ <h1 className="text-3xl font-bold">{company.name}</h1>
+ <p className="text-muted-foreground mt-1">
+ 사용자 관리 · 총 {companyUsers.length}명
+ </p>
+ </div>
+ <Button asChild>
+ <Link href={`/evcp/data-room/owner-companies/${companyId}/users/new`}>
+ <Plus className="h-4 w-4 mr-2" />
+ 사용자 추가
+ </Link>
+ </Button>
+ </div>
+
+ <OwnerCompanyUserList users={companyUsers} companyId={companyId} />
+ </div>
+ );
+ } \ No newline at end of file
diff --git a/app/[lng]/evcp/data-room/owner-companies/new/page.tsx b/app/[lng]/evcp/data-room/owner-companies/new/page.tsx
new file mode 100644
index 00000000..166b8d41
--- /dev/null
+++ b/app/[lng]/evcp/data-room/owner-companies/new/page.tsx
@@ -0,0 +1,18 @@
+// app/(admin)/owner-companies/new/page.tsx
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { OwnerCompanyForm } from "@/lib/owner-companies/owner-company-form";
+
+export default function NewOwnerCompanyPage() {
+ return (
+ <div className="container mx-auto py-8 max-w-2xl">
+ <Card>
+ <CardHeader>
+ <CardTitle>발주처 회사 등록</CardTitle>
+ </CardHeader>
+ <CardContent>
+ <OwnerCompanyForm />
+ </CardContent>
+ </Card>
+ </div>
+ );
+} \ No newline at end of file
diff --git a/app/[lng]/evcp/data-room/owner-companies/page.tsx b/app/[lng]/evcp/data-room/owner-companies/page.tsx
new file mode 100644
index 00000000..483d58bf
--- /dev/null
+++ b/app/[lng]/evcp/data-room/owner-companies/page.tsx
@@ -0,0 +1,32 @@
+// app/evcp/data-room/owner-companies/page.tsx
+import db from "@/db/db";
+import { ownerCompanies } from "@/db/schema";
+import { Button } from "@/components/ui/button";
+import { OwnerCompanyList } from "@/lib/owner-companies/owner-company-list";
+import Link from "next/link";
+import { Plus } from "lucide-react";
+
+export default async function OwnerCompaniesPage() {
+ const companies = await db.select().from(ownerCompanies).orderBy(ownerCompanies.createdAt);
+
+ return (
+ <div className="container mx-auto py-8">
+ <div className="flex justify-between items-center mb-6">
+ <div>
+ <h1 className="text-3xl font-bold">발주처 관리</h1>
+ <p className="text-muted-foreground mt-1">
+ 발주처 회사 및 사용자를 관리합니다
+ </p>
+ </div>
+ <Button asChild>
+ <Link href="/evcp/data-room/owner-companies/new">
+ <Plus className="h-4 w-4 mr-2" />
+ 회사 등록
+ </Link>
+ </Button>
+ </div>
+
+ <OwnerCompanyList companies={companies} />
+ </div>
+ );
+ } \ No newline at end of file
diff --git a/app/[lng]/evcp/data-room/page.tsx b/app/[lng]/evcp/data-room/page.tsx
new file mode 100644
index 00000000..4ff56abc
--- /dev/null
+++ b/app/[lng]/evcp/data-room/page.tsx
@@ -0,0 +1,26 @@
+// app/projects/page.tsx
+import { Suspense } from 'react';
+import { ProjectHeader } from '@/components/project/ProjectHeader';
+import { ProjectList } from '@/components/project/ProjectList';
+
+export default function ProjectsPage() {
+ return (
+ <div className="min-h-screen">
+ <div className="container mx-auto px-4 py-8 max-w-7xl">
+ <Suspense fallback={<ProjectListSkeleton />}>
+ <ProjectList />
+ </Suspense>
+ </div>
+ </div>
+ );
+}
+
+function ProjectListSkeleton() {
+ return (
+ <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
+ {[...Array(6)].map((_, i) => (
+ <div key={i} className="h-32 bg-gray-200 animate-pulse rounded-lg" />
+ ))}
+ </div>
+ );
+} \ No newline at end of file
generated by cgit v1.2.3 (git 2.39.1) at 2025-12-07 05:28:49 +0000